import { IWidget, IOption, EnumClassGroup } from "xcore/cmpnt";

var ClassSelect: IWidget & IOption = {
  cmpnt: "x-class-select",
  valueKey: "class",
  category: "bars",
  props: {
    placeholder: "请选择样式",
    style: { width: "100%" },
    class: [],
    bind: {},
    _ClassGroup: [EnumClassGroup.Size, EnumClassGroup.Margin],
    options: [
      {
        "label": "内容对齐",
        "value": "",
        "group": EnumClassGroup.Layout,
        "children": [
          { "label": "水平居中", "value": "d-flex justify-content-center" },
          { "label": "水平居左", "value": "d-flex justify-content-start" },
          { "label": "水平居右", "value": "d-flex justify-content-end" },
          { "label": "垂直居中", "value": "d-flex align-items-center" },
          { "label": "垂直顶部对齐", "value": "d-flex align-items-start" },
          { "label": "垂直底部对齐", "value": "d-flex align-items-end" },
          { "label": "水平垂直居中", "value": "d-flex align-items-center justify-content-center" },
          { "label": "水平居左垂直居中", "value": "d-flex align-items-center justify-content-start" },
          { "label": "水平居右垂直居中", "value": "d-flex align-items-center justify-content-end" },
          { "label": "水平居中垂直顶部对齐", "value": "d-flex align-items-start justify-content-center" },
          { "label": "水平居中垂直底部对齐", "value": "d-flex align-items-end justify-content-center" }
        ]
      },
      {
        "label": "浮动",
        "value": "",
        "group": EnumClassGroup.Float,
        "children": [
          { "label": "左浮动", "value": "float-start" },
          { "label": "右浮动", "value": "float-end" },
          { "label": "清除浮动", "value": "clearfix" }
        ]
      },
      {
        "label": "尺寸",
        "value": "",
        "group": EnumClassGroup.Size,
        "children": [
          { "label": "宽度 25%", "value": "w-25" },
          { "label": "宽度 50%", "value": "w-50" },
          { "label": "宽度 75%", "value": "w-75" },
          { "label": "宽度 100%", "value": "w-100" },
          { "label": "高度 25%", "value": "h-25" },
          { "label": "高度 50%", "value": "h-50" },
          { "label": "高度 75%", "value": "h-75" },
          { "label": "高度 100%", "value": "h-100" }
        ]
      },
      {
        "label": "外边距",
        "value": "",
        "group": EnumClassGroup.Margin,
        "children": [
          { "label": "外边距 1", "value": "m-1" },
          { "label": "外边距 2", "value": "m-2" },
          { "label": "外边距 3", "value": "m-3" },
          { "label": "外边距 4", "value": "m-4" },
          { "label": "外边距 5", "value": "m-5" },
          { "label": "自动外边距", "value": "m-auto" },
          { "label": "外边距 X 轴 1", "value": "mx-1" },
          { "label": "外边距 Y 轴 1", "value": "my-1" },
        ]
      },
      {
        "label": "内边距",
        "value": "",
        "group": EnumClassGroup.Padding,
        "children": [
          { "label": "内边距 1", "value": "p-1" },
          { "label": "内边距 2", "value": "p-2" },
          { "label": "内边距 3", "value": "p-3" },
          { "label": "内边距 4", "value": "p-4" },
          { "label": "内边距 5", "value": "p-5" },
          { "label": "内边距 X 轴 1", "value": "px-1" },
          { "label": "内边距 X 轴 2", "value": "px-2" },
          { "label": "内边距 X 轴 3", "value": "px-3" },
          { "label": "内边距 X 轴 4", "value": "px-4" },
          { "label": "内边距 X 轴 5", "value": "px-5" },
          { "label": "内边距 Y 轴 1", "value": "py-1" },
          { "label": "内边距 Y 轴 2", "value": "py-2" },
          { "label": "内边距 Y 轴 3", "value": "py-3" },
          { "label": "内边距 Y 轴 4", "value": "py-4" },
          { "label": "内边距 Y 轴 5", "value": "py-5" },
        ]
      },
      {
        "label": "边框样式",
        "value": "",
        "group": EnumClassGroup.Border,
        "children": [
          { "label": "实线边框", "value": "border" },
          { "label": "虚线边框", "value": "border-dashed" },
          { "label": "点状边框", "value": "border-dotted" },
          { "label": "双线边框", "value": "border-double" },
          { "label": "无边框", "value": "border-0" },
          { "label": "圆角边框", "value": "rounded rounded-2 " },
          { "label": "圆角边框（大）", "value": "rounded rounded-4" },
          { "label": "圆角边框（小）", "value": "rounded rounded-1" }
        ]
      },
      {
        "label": "背景颜色",
        "value": "",
        "group": EnumClassGroup.Background,
        "children": [
          { "label": "主要背景", "value": "bg-primary" },
          { "label": "次要背景", "value": "bg-secondary" },
          { "label": "成功背景", "value": "bg-success" },
          { "label": "危险背景", "value": "bg-danger" },
          { "label": "警告背景", "value": "bg-warning" },
          { "label": "信息背景", "value": "bg-info" },
          { "label": "浅色背景", "value": "bg-light" },
          { "label": "深色背景", "value": "bg-dark" },
          { "label": "白色背景", "value": "bg-white" },
          { "label": "透明背景", "value": "bg-transparent" }
        ]
      },
      {
        "label": "字体颜色",
        "value": "",
        "group": EnumClassGroup.TextColor,
        "children": [
          { "label": "主要字体色", "value": "text-primary" },
          { "label": "次要字体色", "value": "text-secondary" },
          { "label": "成功字体色", "value": "text-success" },
          { "label": "危险字体色", "value": "text-danger" },
          { "label": "警告字体色", "value": "text-warning" },
          { "label": "信息字体色", "value": "text-info" },
          { "label": "浅色字体色", "value": "text-light" },
          { "label": "深色字体色", "value": "text-dark" },
          { "label": "白色字体色", "value": "text-white" },
          { "label": "灰色字体色", "value": "text-muted" }
        ]
      },
      {
        "label": "文本对齐",
        "value": "",
        "group": EnumClassGroup.TextAlignment,
        "children": [
          { "label": "左对齐", "value": "text-start" },
          { "label": "居中对齐", "value": "text-center" },
          { "label": "右对齐", "value": "text-end" }
        ]
      },
      {
        label: "对象对齐",
        value: "",
        group: EnumClassGroup.ObjectFit,
        children: [
          { "label": "填充", "value": "object-fit-fill" },
          { "label": "包含", "value": "object-fit-contain" },
          { "label": "覆盖", "value": "object-fit-cover" },
          { "label": "缩放 ", "value": "object-fit-scale-down" },
          { "label": "无", "value": "object-fit-none" }
        ]
      },
      {
        label: "透明度",
        value: "",
        group: EnumClassGroup.Opacity,
        children: [
          { label: "0% 透明", value: "opacity-0" },
          { label: "25% 透明", value: "opacity-25" },
          { label: "50% 透明", value: "opacity-50" },
          { label: "75% 透明", value: "opacity-75" },
          { label: "100% 不透明", value: "" }
        ]
      },
      {
        label: "溢出处理",
        value: "",
        group: EnumClassGroup.Overflow,
        children: [
          { label: "可见", value: "overflow-visible" },
          { label: "隐藏", value: "overflow-hidden" },
          { label: "滚动", value: "overflow-scroll" },
          { label: "自动滚动", value: "overflow-auto" }
        ]
      },
      {
        "label": "字体大小",
        "value": "",
        "group": EnumClassGroup.FontSize, 
        "children": [
          { "label": "FS-9", "value": "fs-9" },
          { "label": "FS-8", "value": "fs-8" }, 
          { "label": "FS-7", "value": "fs-7" },
          { "label": "FS-6", "value": "fs-6" }, 
          { "label": "FS-5", "value": "fs-5" },
          { "label": "FS-4", "value": "fs-4" }, 
          { "label": "FS-3", "value": "fs-3" },
          { "label": "FS-2", "value": "fs-2" },
          { "label": "FS-1", "value": "fs-1" }
        ]
      }
    ]
  },
  events: {},
  ctl: {
    icon: "iconfont te-i-select",
    name: "ClassSelect",
    group: "css",
    text: "颜色",
  },
};
export { ClassSelect };
